<template>
	<router-view />
	<van-tabbar route>
		<van-tabbar-item
			replace
			v-for="item in menu"
			:key="item.name"
			:to="item.path"
			:icon="((item.meta?.icon) as string)"
		>
			{{ item.meta?.title }}</van-tabbar-item
		>
		<!-- <van-tabbar-item replace to="/category" icon="apps-o">分类</van-tabbar-item>
  <van-tabbar-item replace to="/worthbuy" icon="gift-o">值得买</van-tabbar-item>
    <van-tabbar-item replace to="/shopcart" icon="cart-o">购物车</van-tabbar-item>
    <van-tabbar-item replace to="/center" icon="user-o">个人</van-tabbar-item> -->
	</van-tabbar>
</template>

<script lang="ts">
	import { defineComponent } from 'vue'
	export default defineComponent({
		name: 'Tabbar'
	})
</script>

<script lang="ts" setup>
	import { computed } from 'vue'
	import { routes } from '@/router/routes'

	const menu = computed(() => {
		return routes.filter(item => !item.meta?.hidden)
	})
</script>

<style scoped></style>
